{% raw %}
<script type="text/x-template" id="omesaas-collection-product-temp">

    {%- capture text_ellipsis -%}
    {%- if theme_config.global.product_title_style == 'hide' -%}
        text-ellipsis
    {%- elsif theme_config.global.product_title_style == 'hide2' -%}
        text-ellipsis2
    {%- endif -%}
    {%- endcapture -%}

    {% if theme_config.global.product_size == "1" %}
    {% assign product_size = "11" %}
    {% elsif theme_config.global.product_size == "2" %}
    {% assign product_size = "34" %}
    {% elsif theme_config.global.product_size == "3" %}
    {% assign product_size = "23" %}
    {% elsif theme_config.global.product_size == "4" %}
    {% assign product_size = "12" %}
    {% endif %}

    {% for product in products %}
    


{%- capture product_handle -%}
  {% if product.handle and product.handle != "" %}
    {%- if collection_product_url == '1' -%}
      /products/{{ product.handle }}?data_from={{product.data_from | default:data_from}}
    {%- else -%}
      {%- if collection_handle and collection_handle != "" -%}/collections/{{collection_handle}}{% endif %}/products/{{ product.handle }}?data_from={{product.data_from | default:data_from}}
    {%- endif -%}
  {% else %}
    javascript:;
  {%- endif -%}
{%- endcapture -%}

    {%- capture hover_class -%}
    {% if theme_config.global.product_move_two %}{% if product.images[1].src %}product_img_hover{% endif %}{% endif %}
    {%- endcapture -%}


    {%- capture product_alt -%}
    {%- if product.image.alt == "" -%}
    {{ product.title }}
    {%- else -%}
    {{ product.image.alt }}
    {%- endif -%}
    {%- endcapture -%}

    <li class="{{ swiper }}">
        <div class="product_pic {{hover_class}}">
            {% comment %} data-product-ec-info='{{product.ec_data}}' data-product-ec-list-name="{{product.hit_type_category}}" data-product-ec-list-position="{{product.hit_type_value}}" {% endcomment %}
            <a class="product_img plugin-product_item-img_box"  data-product-id="{{product.id}}" data-scale="{{ product_size }}" href="{{product_handle}}">
                <img class="default_img" alt="{{product_alt}}" data-sizes="auto" data-src="{{ product.src }}" src="{{ product.src | lazy_img_url }}">
                {% if theme_config.global.product_move_two %}
                {% if product.images[1].src %}
                <img class="hover_img" data-sizes="auto" data-src="{{ product.images[1].src }}" src="{{ 'empty_loading.png' | public_asset_abs_url }}">
                {% endif %}
                {% endif %}
            </a>
            {% if product.available == 0 %}
                <div class="soldout">{{ lang.general.sold_out }}</div>
            {% endif %}
    
            {% if theme_config.global.product_discount_label and product.variant.price > 0 %} 
            {% if product.variant.price < product.variant.compare_at_price %}
            {% assign price = product.variant.compare_at_price | minus: product.variant.price | divided_by: product.variant.compare_at_price | times: 100 | floor %}
            {% if price > 0 %}
            <div class="discount_tag {{ theme_config.global.discount_label_style }}"><div class="discount_tag_graphics"></div><div class="discount_tag_name">{{ price }}% <span>OFF</span></div></div>
            {% endif %} 
            {% endif %}
            {% endif %}
            <div class="product_tag_list">
                {% if theme_config.global.product_preview %}
                <a class="product_view product_quick-mobile-view" data-handle="{{ product.handle }}" data-from="{{data_from}}" href="javascript:void(0)">
                  <svg t="1679549187129" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5175" width="20" height="20">
                    <path fill="#ffffff" d="M512 307.2a387.072 387.072 0 0 0-350.3104 223.3344 387.072 387.072 0 0 0 350.3104 223.3344 387.072 387.072 0 0 0 350.3104-223.3344A387.072 387.072 0 0 0 512 307.2m0-102.4a488.7552 488.7552 0 0 1 460.8 325.7344 488.7552 488.7552 0 0 1-460.8 325.7344 488.7552 488.7552 0 0 1-460.8-325.7344 488.7552 488.7552 0 0 1 460.8-325.7344z" p-id="5176"></path>
                    <path d="M512 512m-102.4 0a102.4 102.4 0 1 0 204.8 0 102.4 102.4 0 1 0-204.8 0Z" fill="#ffffff" p-id="5177"></path>
                  </svg>
                </a>
                {% endif %}
            </div>
        </div>
        <div class="block_product_name {% unless theme_config.global.product_title_model %}wap_hide{% endunless %}">
            <a class="{{ text_ellipsis }}" href="{{product_handle}}">{{ product.highlight_title | default : product.title }}</a>
        </div>
        <div class="product_price">
            <span class="general_buying-color">{{ product.variant.price | money }}</span>
            {% if product.variant.compare_at_price != 0 %}
                <span class="product_oldprice general_original-color">{{ product.variant.compare_at_price | money }}</span>
            {% endif %}
        </div>
        {% if theme_config.global.product_discount_label_style_switch and product.variant.price > 0 %} 
        {% if product.variant.price < product.variant.compare_at_price %}
        <div class="product_price" style='color:var(--discount_tag_bg);margin-top: 4px;'>
            {{lang.general.save}}
            {% if theme_config.global.product_discount_label_style == 2 %}
            {% assign price = product.variant.compare_at_price | minus: product.variant.price | divided_by: product.variant.compare_at_price | times: 100 | floor %}
            {{price}}%
            {% else %}
            {% assign price = product.variant.compare_at_price | minus: product.variant.price  | round: 2  %}
            {{price | money}}  
            {% endif %}
        </div>
        {% endif %}
        {% endif %}
        {%- unless theme_config.global.product_is_score == false -%}
        {% if product.star > 0 %}
        {% assign width = product.star | default:0 | divided_by: 5 | times:100 %}
        <div class="moi-start-warp" style="margin-top:10px">
            <div class="comment-star-warp">
            <div class="comment-star-base">
                {% for index in (1..5) %}
                <svg t="1632626527998" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7121" width="20" height="20"><path d="M512 0l122.88 352.96 389.12 2.752-300.8 238.08 118.272 380.032L512 747.392l-329.6 226.496L293.312 588.8 0.32 355.776l389.12-2.752z" fill="{{theme_config.global.product_score_uncheck_color | default:'#bbbbbb'}}" p-id="7122"></path></svg>
                {% endfor %}
            </div>

            <div class="comment-star-base comment-star-warp-choose" style="width:{{width}}%">
                {% for index in (1..5) %}
                <svg t="1632626527998" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7121" width="20" height="20"><path d="M512 0l122.88 352.96 389.12 2.752-300.8 238.08 118.272 380.032L512 747.392l-329.6 226.496L293.312 588.8 0.32 355.776l389.12-2.752z" fill="{{theme_config.global.product_score_selected_color | default:'#F8AD6B'}}" p-id="7122"></path></svg>
                {% endfor %}
            </div>
            </div>
            {% if theme_config.global.product_is_score_number == 2 %}
                <span>({{ product.comment_total_count }})</span>
              {% else %}
                <span>({{ product.star }})</span>
              {% endif %}
        </div>
        {% endif %}
        {%- endunless -%}
         {% if theme_config.global.product_img_list_type != 0 %}
        <div class="block_product_img_list noRender">
            <div class="img_list" style="display: flex;justify-content: center;">
            {% if theme_config.global.product_img_list_type == "1" %}
                {% assign colorOptions = theme_config.global.product_sku_options | join: ',' | downcase | split: ',' %}
                {% assign isFindSuccess = false %}
                {% if product.variants.size > 0 %}
                    {% for option in product.options %}
                        {% assign option_name = option.name | downcase %}
                        {% assign hasOptionName = colorOptions contains option_name %}
                        {% if hasOptionName and isFindSuccess == false %}
                            {% assign isFindSuccess = true %}
                            {% assign optionIndex = option.position | plus: 1 %}
                            {% assign optionTitle = "option" | append: optionIndex | append: "_title" %}
                            {% assign optionValueTitle = "option" | append: optionIndex | append: "_value_title" %}
                            {% assign optionValues = "" %}
                            {% assign isSelectOptions = "" %}
                            
                            {% for optionValueItem in option.values %}
                                {% assign optionValues = optionValues | append: optionValueItem.option_value | append: ',' %}
                            {% endfor %}
                            {% for variant in product.variants %}
                                {% assign varinatTitle = variant[optionTitle] | downcase %}
                                {% assign variantValue = variant[optionValueTitle] | downcase %}
                                {% assign hasVarinatTitle = colorOptions contains varinatTitle %}
                                {% assign hasValue = optionValues contains variantValue %}
                                
                                {% if hasVarinatTitle != '' and  hasValue != '' %}
                                    {% unless isSelectOptions contains variantValue %}
                                        {% if variant.image %}
                                            {% assign isSelectOptions = isSelectOptions | append: variantValue | append: ',' %}
                                            <a href="{{ product_handle | append: "&variant_sku_code=" | append: variant.sku_code }}" class="img_list_item"><img data-src="{{variant.image.src}}"  src="{{ 'empty_loading.png' | public_asset_abs_url }}"></a>
                                        {% endif %}
                                    {% endunless %}
                                {% endif %}
                            {% endfor %}
                            
                        {% endif %}
                    {% endfor %}
                {% endif %}

                {% elsif theme_config.global.product_img_list_type == "2" %}
                    {% if product.variants.size > 0 %}
                        {% for imgsItem in product.images %}
                            <a href="{{ product_handle }}" class="img_list_item"><img data-src="{{ imgsItem.src }}" src="{{ 'empty_loading.png' | public_asset_abs_url }}"></a>
                        {% endfor %}
                    {% endif %}
                {% endif %}
                <div class="morNumber"></div>
            </div>
        </div>
        {% endif %}
    </li>
    {% endfor %}
</script>

{% endraw %}
